<template>
  <div>
    <div class="card-view _p-20 disFlxJS">
      <div>
        <h6 style="margin-bottom: 0;font-weight: bolder;">资源平台服务费（从单笔订单佣金中按百分比抽取）</h6>
        <div class="tips _mt-5">例如：订单单价：¥100.00，商家设置佣金为¥20.00，则平台服务费 = ¥20.00 × 服务费百分比</div>
      </div>
      <h5>{{ serviceFeePercent }}%</h5>
    </div>
    <div class="card-view _p-20 disFlxJS _mt-30">
      <div>
        <h6 style="margin-bottom: 0;font-weight: bolder;">支付费率（从单笔订单中抽取费率）</h6>
        <div class="tips _mt-5">例如：订单单价：¥100.00，则支付费率 = ¥100.00 × 费率百分比</div>
      </div>
      <h5>{{ paymentPercent }}%</h5>
    </div>
    <div class="card-view _p-20 disFlxJS _mt-30">
      <div style="width: 50%">
        <h6 style="margin-bottom: 0;font-weight: bolder;">资源平台服务费（从单笔订单佣金中按百分比抽取）</h6>
        <p class="tips _mt-5">
          资源平台服务费由机构抽取，如机构又将会员的产品推广给合作机构，则由机构从抽取的服务费中再按比例分配给合作机构作为合作机构推广的服务费
        </p>
        <p class="tips">例如：订单单价：¥100.00，商家设置佣金为¥20.00，则平台服务费 = ¥20.00 × 服务费百分比</p>
      </div>
      <div>
        <a-input-number v-model="percent" :min="0" placeholder="请输入" style="width: 100px;" />
        <span class="_ml-10">%</span>
      </div>
    </div>

    <div  class="disFlxCC _mt-20">
      <a-button type="primary" size="large" style="width: 200px" @click="handleTenantSave">保存</a-button>
    </div>
  </div>
</template>

<script>
import { getTenantInfoByProjectType, tenantOneSave } from '@/api/system/base'

export default {
  components: {},
  data() {
    return {
      projectType: 3,
      /** 平台服务费 */
      serviceFeePercent: 0,
      /** 支付费率 */
      paymentPercent: 0,
      /** 资源平台服务费 */
      percent: 0
    }
  },
  computed: {},
  watch: {},
  methods: {
    handleTenantSave() {
      tenantOneSave({ projectType: this.projectType, percent: this.percent }).then(({ code, msg }) => {
        if (code === 90001) {
          Modal.confirm({
            title: '提示',
            content: msg,
            cancelText: '暂不开通',
            okText: '去开通',
            onCancel: () => { },
            onOk: () => {
              this.$router.push({
                path: '/system/paySettings',
                query: {
                  titleKey: 'onlinePayment'
                }
              })
            }
          })
        } else if (code === 0) {
          this.$message.success('保存成功')
        }
      })
    }
  },
  created() {
    getTenantInfoByProjectType(this.projectType).then(r => {
      if (!r.code && r.data) {
        const res = r.data
        this.serviceFeePercent = res.serviceFeePercent
        this.paymentPercent = res.paymentPercent
        this.percent = res.percent
      }
    })
  },
  mounted() { }
}
</script>

<style lang="less" scoped>
.card-view {
  background-color: #f7f8fa;
}

.tips {
  color: rgb(108, 108, 108);
  font-size: 14px;
}
</style>
